<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<meta name="viewport"
			content="width=device-width, initial-scale=1.0, user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<!-- 引入我们的css初始化文件 -->
		<link rel="stylesheet" href="css/normalize.css">
		<!-- 引入我们首页的css -->
		<link rel="stylesheet" href="css/index.css">
		<!-- 引入swipercss文件 -->
		<link rel="stylesheet" href="css/swiper-bundle.min.css">
		<!-- 引入swiper js 文件 -->
		<script src="js/swiper-bundle.min.js"></script>
		<!-- 引入我们自己的js文件 -->
		<script src="js/index.js"></script>
		<title>Document</title>
	</head>

	<body>
		<!-- 顶部 -->
		<header class="app">
			<ul>
				<li>
					<img src="images/close.png" alt="">
				</li>
				<li>
					<img src="images/logo.png" alt="">
				</li>
				<li>打开京东App，购物更轻松</li>
				<li>立即打开</li>
			</ul>
		</header>
		<!-- 搜索 -->
		<div class="search-wrap">
			<div class="search-btn"></div>
			<div class="search">
				<div class="jd-icon"></div>
				<div class="sou"></div>
			</div>
			<div class="search-login">登陆</div>
		</div>
		<!-- 主体内容部分 -->
		<div class="main-content">
			<!-- 滑动图 -->
			<div class="slider">
				<!-- Swiper 注意不要更改里面的结构和类名 -->
				<div class="swiper-container">
					<div class="swiper-wrapper">
						<div class="swiper-slide"><img src="upload/banner.dpg"></div>
						<div class="swiper-slide"><img src="upload/banner1.dpg"></div>
						<div class="swiper-slide"><img src="upload/banner2.dpg"></div>
						<div class="swiper-slide"><img src="upload/banner3.dpg"></div>
					</div>
					<!-- Add Pagination -->
					<div class="swiper-pagination"></div>
					<!-- Add Arrows -->
					<div class="swiper-button-next"></div>
					<div class="swiper-button-prev"></div>
				</div>
			</div>

			<!-- 小家电品牌日 -->
			<div class="brand">
				<div>
					<a href="#">
						<img src="upload/pic11.dpg" alt="">
					</a>
				</div>
				<div>
					<a href="#">
						<img src="upload/pic22.dpg" alt="">
					</a>

				</div>
				<div>
					<a href="#">
						<img src="upload/pic33.dpg" alt="">
					</a>

				</div>
			</div>
			<!-- nav部分 -->
			<nav class="clearfix">
				<a href="">
					<img src="upload/nav1.webp" alt="">
					<span>京东超市</span>
				</a>

				<a href="">
					<img src="upload/nav2.webp" alt="">
					<span>京东超市</span>
				</a>

				<a href="">
					<img src="upload/nav1.webp" alt="">
					<span>京东超市</span>
				</a>

				<a href="">
					<img src="upload/nav1.webp" alt="">
					<span>京东超市</span>
				</a>

				<a href="">
					<img src="upload/nav1.webp" alt="">
					<span>京东超市</span>
				</a>

				<a href="">
					<img src="upload/nav3.webp" alt="">
					<span>京东超市</span>
				</a>

				<a href="">
					<img src="upload/nav1.webp" alt="">
					<span>京东超市</span>
				</a>

				<a href="">
					<img src="upload/nav1.webp" alt="">
					<span>京东超市</span>
				</a>

				<a href="">
					<img src="upload/nav1.webp" alt="">
					<span>京东超市</span>
				</a>

				<a href="">
					<img src="upload/nav1.webp" alt="">
					<span>京东超市</span>
				</a>

			</nav>
			<!-- 新闻模块 -->
			<div class="news">
				<a href="#">
					<img src="upload/new1.dpg" alt="">
				</a>
				<a href="#">
					<img src="upload/new2.dpg" alt="">

				</a>
				<a href="#">
					<img src="upload/new3.dpg" alt="">

				</a>
			</div>
		</div>
	</body>

</html>
